<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Beetl 论坛</title>
    <meta name="keywords" content="Beetl,BeetlSql" />
    <meta name="description" content="论坛模板" />
    <link rel="shortcut icon" href="/img/favicon.ico" />
    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet" />
    <link th:href="@{/font-awesome.min.css}" rel="stylesheet" />
    <link th:href="@{/bbs-core.css}" rel="stylesheet" />
    <script th:src="@{/js/jquery-2.1.1.js}"></script>
    <script th:src="@{/js/alert.js}"></script>
    <script th:src="@{/js/common.js}"></script>
    <script th:src="@{/js/index.js}"></script>
    <script th:src="@{/js/detail.js}"></script>
    <script th:src="@{/js/jquery.min.js}"></script>
    <script th:src="@{/js/bootstrap.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <script th:src="@{/js/bootstrap.page.js}"></script>
    <style type="text/css">
    	.ani{-webkit-transition: all .3s ease-out;-ms-transition: all .3s ease-out;-moz-transition: all .3s ease-out;-o-transition: all .3s ease-out;transition: all .3s ease-out;}
		.serach .form-control{border-color: #ffce3d;}
		#serach-btn{border-color: #ffce3d;background: #f56a00;color: #fff;}
		.serach .form-control:focus {border-color: #ffce3d;box-shadow: inset 0 1px 1px rgba(0,0,0,.075);}
    	body { padding-top: 70px;font-family: PingFang SC,Microsoft YaHei,sans-serif; background-color: #f9f9f9;}
    	.navbar-brand>svg{width: 24px;vertical-align: middle;fill:#000;}
    	.mcount{background-color: orange;position: relative;top: -1px;}

   		.navbar-default{background: #ffce3d;border-color:#fff;}
   		.navbar-default .navbar-brand , .navbar-default .navbar-nav>li>a{color: #000;}
   		.navbar-default .navbar-brand:focus, .navbar-default .navbar-brand:hover{ color: #000;}
   		.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {color: #000; background-color: #ffbf00;}
		.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover{ color: #000; background-color: #ffbf00;}
   		
   		#serach-btn:hover{cursor: pointer;}
   		
   		.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {border-color: #f56a00;background-color: #ffce3d;}
		.navbar-default .navbar-toggle {border-color: #f56a00;}
   		.navbar-default .navbar-toggle .icon-bar {background-color: #f56a00;}
   		.navbar-default .navbar-collapse, .navbar-default .navbar-form{border-color: #f56a00}
/*    		分页插件样式 */
   		.pagination>li>a, .pagination>li>span,.pagination>li>a:hover{color: #000;}
		.pagination>li>a:focus, .pagination>li>a:hover, .pagination>li>span:focus, .pagination>li>span:hover{background-color: #ffbf00;    border-color: #ffbf00;color: #fff;}
    	.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover{color: #fff;background-color: #f56a00;border-color: #f56a00;}
    	.pagination>li:first-child>a,.pagination>li:first-child>span, .pagination>li:last-child>a,  .pagination>li:last-child>span{border-radius: 0px}
   		
   		.author-panel{background: #fff;padding: 15px;overflow: hidden;}
    	.author-panel	.head { width: 50%;overflow: hidden;border-radius: 50%;}
   		.author-panel .name{margin-top: 15px;}
   		.author-panel .home a{color: #555}
		.author-panel .help{width: 100%}
/*    		首页样式 */
        .topic{position:relative;width: 100%;overflow: hidden;padding: 15px;background: #fff; margin: 14px 0;}
        .topic .li-style{background-color:#33FF33;}
		.topic .admin{position: absolute;top: 10px;right: 10px;}
/*     	.topic:hover{cursor: pointer;box-shadow: 0 5px 20px -4px rgba(153, 153, 153, 0.38); transform: translateY(-2px);} */
     	.topic:hover{cursor: pointer;}
    	.topic .author{font-size: 14px;color:#333;margin-bottom: 5px;}
    	.topic .author a{color:#333;}
    	.topic .author span{color: #999;}
    	.topic .author .type{color: #bfbfbf;font-size: 14px;}
    	.topic .post .label{color: #fff}
    	.topic .post .tiezi{color: #333;font-size: 15px;} 
    	.li-style{line-height:50px; height:70px;}
    	.author,.post{height:25px}  		
/*    		滚动条样式 */
   		::-webkit-scrollbar {width: 10px!important;height: 5px!important;-webkit-appearance: none;}
		::-webkit-scrollbar-thumb {height: 5px;border: 1px solid transparent;border-top: none;border-bottom: none;-webkit-border-radius: 6px;background-color: rgba(0,0,0,.3);background-clip: padding-box;}
		
    </style>
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="/bbs/bbs/index">
      <svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1880"><path d="M832.299957 714.965621c-71.047126 88.067778-148.2126 70.077032-148.2126 70.077032 77.615729-65.686025 74.107835-233.597269 74.107835-233.597269 56.979736 6.564509 74.104765 93.439112 74.104765 93.439112 2.635013 53.857629 148.21567 93.439112 148.21567 93.439112C887.304711 721.78698 832.299957 714.965621 832.299957 714.965621zM513.173732 467.12086c0 0-26.707268-15.610536-21.554922-82.356706 0 0 43.672662-370.594433 237.145072-313.196165 0 0 128.243803 88.283696-21.580504 292.610314C707.182354 364.178303 570.780755 504.72634 513.173732 467.12086zM560.578392 504.72634c31.834033 103.172801-49.409316 210.239282-49.409316 210.239282-95.057983 32.713053-67.633377-56.756655-67.633377-56.756655 58.984393-61.013609 42.930765-130.125663 42.930765-130.125663C512.189312 506.013659 560.578392 504.72634 560.578392 504.72634zM214.740806 668.246577c0 0-15.826454-68.054979 9.243525-99.791797 0 0 19.540032 53.137221 64.86431 6.345522 0 0 13.948687-61.868069-50.226938-47.768957 0 0 21.086248-69.096704 66.274426-103.007025-82.760912-100.30652-238.370992-82.821287-238.370992-82.821287-51.842739-30.236652 0-46.715975 0-46.715975 135.454018-0.991584 222.324528 93.439112 222.324528 93.439112-23.989367-126.739543-148.21567-163.520237-148.21567-163.520237-39.818891-48.290843 17.485233-35.68371 17.485233-35.68371 126.141932 81.534991 149.874449 190.310394 154.345274 230.244918 20.531616-12.791327 45.414329-18.281365 75.196633-7.67889 0 0 156.796092 73.606415-24.702612 256.95935C362.956476 668.246577 246.483764 776.989233 214.740806 668.246577zM706.990996 513.219781c30.182416 116.948549-22.903639 201.74584-22.903639 201.74584-59.500139 125.21891-148.21567 46.719044-148.21567 46.719044 93.910856-94.708012 98.807377-256.95935 98.807377-256.95935C675.925467 502.981602 706.990996 513.219781 706.990996 513.219781z" p-id="1881"></path></svg>
      Share-BBS
      </a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li><a href="/index/1.html">首页综合</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">板块 <span class="caret"></span></a>
          <ul class="dropdown-menu" role="menu">
			  <li th:each="module,moduleStat : ${modules}" ><a th:href="@{/topic/module/${moudle.id}-1.html}" th:text="${module.name}"></a></li>
          </ul>
        </li>
      </ul>
      <form class="navbar-form navbar-left">
        <div class="form-group">
	        <div class="input-group serach">
	         	<input type="text" class="form-control" id="keyword" name="keyword" placeholder="关键字搜索" />
			  	<span class="input-group-addon" id="serach-btn">搜索</span>
			</div>
         </div>
      </form>
      
      <ul class="nav navbar-nav navbar-right" th:if="${currentUser} == null" >
				<li><a href="#login-dialog" data-toggle="modal"><i class="fa fa-sign-in"></i> 登录</a></li>
				<li><a href="#reg-dialog" data-toggle="modal"><i class="fa fa-user-plus"></i> 注册</a></li>
	  </ul>
	  <ul class="nav navbar-nav navbar-right" th:if="${currentUser} != null" >
				<li><a href="/bbs/topic/add.html"><i class="fa fa-plus"></i> 发帖</a></li>
				<li class="dropdown">
					<a href="#" class="dropdown-toggle" data-toggle="dropdown" th:text="${currentUser.userName}"><i class="fa fa-user-circle-o"></i><span class="badge mcount" th:if="${mcount} gt 0" th:text="${mcount}"></span><span class="caret"></span></a>
					<ul class="dropdown-menu" role="menu">
						<li><a href="javascript:;" th:text="|你已有${currentUser.score}积分|"></a></li>
						<li><a href="javascript:;" th:text="|等级${currentUser.level}|"></a></li>
						<li class="divider"></li>
						<li><a href="/bbs/myMessage.html">给我的回复</a></li>
					</ul>
				</li>
				<li><a href="javascript:;" onclick="$.post('/bbs/user/logout',function(){location.reload()})"><i class="fa fa-sign-out"></i> 注销</a></li>
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>
<div class="container">
  <div class="row">
    <div class="col-sm-9">
      <h3 th:text="|主题：${topic.content}|"></h3>
      <div class="panel panel-default" data-post="${post.id}" th:each="post,postStat : ${postPage}" >
			<div class="panel-heading">
				回帖人：<span class="label label-primary" th:text="${post.user.userName}"></span>&nbsp;&nbsp;&nbsp;&nbsp;
				时间：<span class="label label-default" th:text="${#dates.format(post.createTime,'yyyy-MM-dd HH:mm:ss')}"></span>
				
				<div class="btn-group btn-group-xs pull-right" th:if="${currentUser} != null" >
					<a class="btn btn-default" href="/bbs/admin/post/edit/${post.id}.html" th:if="${currentUser.id} == ${post.userId} or ${isAdmin}"><i class="fa fa-edit"></i> 编辑</a>
					<a class="btn btn-default" href="javascript:;" onclick="deletePost(this)" th:if="${currentUser.id} == ${post.userId} or ${isAdmin}"><i class="fa fa-trash"></i> 删除</a>
					<a class="btn btn-default" href="javascript:;" onclick="showReplyDialog('${post.id!}','${topic.id!}')"><i class="fa fa-reply"></i> 回复</a>
				</div>
			</div>
			<div class="panel-body" th:text="${post.content}"></div>
			<ul class="list-group" th:if="${post.replys.size() gt 0}" >
					<li class="list-group-item" th:each="reply,replyStat : ${post.replys}" >
						<span class="text-info" th:text="${reply.user.userName}"></span>回复说：<span class="text-muted" th:text="${reply.content}"></span>&nbsp;&nbsp;&nbsp;&nbsp;时间：<span class="text-muted" th:text="${#dates.format(post.createTime,'yyyy-MM-dd HH:mm:ss')}"></span>
					</li>
			</ul>
      </div>
      <form id="postForm" action="/bbs/post/save" method="POST"  onsubmit="return ajaxSubmit(this,'reload')" th:if="${currentUser} != null" > 
			<input type="hidden" name="topicId" value="${topic.id}" />
			<div class="form-group">
			<textarea id="postContent" name="content"></textarea>
			</div>
			<button type="submit" class="btn btn-sm btn-primary pull-right"><i class="fa fa-check"></i> 提 交</button>
      </form>
    </div>
  </div>
</div>
<!-- 回复弹层 -->
<div class="modal fade" id="reply-dialog">
	<div class="modal-dialog modal-sm">
		<div class="modal-content">
			<div class="modal-body">
				<form class="form-search" action="${ctxPath}/bbs/reply/save" onsubmit="return ajaxSubmit(this,'reload')" >
					<input type="hidden" name="postId" value="${post.id!}"/>
					<input type="hidden" name="topicId" value="${topic.id!}"/>
					<div class="form-group">
						<textarea placeholder="请输入回复内容" class="form-control" name="content" style="height:100px;resize:none;" maxlength="100"></textarea>
					</div>
					<button type="submit" class="btn btn-primary btn-block">确定提交</button>
				</form>
			</div>
		</div>
	</div>
</div>
</body>
</html>
 
